#sidebar {
	display: flex;
	flex-direction: column;
	.body {
		flex-grow: 1;
	}

	.footer {
		color: $color-3;
		padding: 1em;
		font-size: 0.8em;
		opacity: 0.7;
		position:absolute;
		bottom: 0.2em;
	}

	@include media-breakpoint-up($header-trigger) {
		right: -30%;
		width: 30%;
		&.open {
			right: 0%;
		}
		&.left {
			right: auto;
			left: -30%;
			&.open {
				left: 0%;
			}
		}
		> ul {
			flex-direction: column;
			li {
				.nav-sub {
					position: static;
				}
				i {
					margin-right: 0.5em;
				}
			}
		}
	}
}
